$color-primary: #006CFF;
$color-danger: #f56c6c;
$color-primary-hover: #44684c;
$color-primary-light: #19997a;
$color-primary-active: #44684c;
$color-hover: #44684c;
$color-active: $color-hover;

// sidebar
$menuText: #bfcbd9;
$menuActiveText: #409EFF;
$subMenuActiveText: #f4f4f5; //https://github.com/ElemeFE/element/issues/12951

$menuBg: #304156;
$menuHover: #263445;

$subMenuBg: #1f2d3d;
$subMenuHover: #001528;

$sideLogoBg: #2b2f3a;
$sideBarWidth: 210px;

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  colorPrimary: $color-primary;
  colorPrimaryLight: $color-primary-light;
  colorDander: $color-danger;

  menuText: $menuText;
  menuActiveText: $menuActiveText;
  subMenuActiveText: $subMenuActiveText;
  menuBg: $menuBg;
  menuHover: $menuHover;
  subMenuBg: $subMenuBg;
  subMenuHover: $subMenuHover;
  sideBarWidth: $sideBarWidth;
}
